import { audioContext, playerStore } from "../../store/index"

const playModeNames = ["order", "repeat", "random"]
Page({
    data: {
        id: 0,

        currentSong: [],
        lyricInfos : [],
        durationTime: 0,
        
        currentTime: 0,
        currentLyricIndex: 0,
        currentLyricText: "",
        // 播放模式
        isPlaying: false,
        playingName: "pause",

        playModeIndex: 0,
        playModeName: "order",

        isMusicLyric: true,
        currentPage: 0,
        contentHeight:0,
        sliderValue: 0,
        isSliderchanging: false,
        lyricScrollTop: 0
    },
    onLoad: function (options) {
        // 1.获取传入的id
        const id = options.id
        this.setData({ id })
        // 2.根据id获取歌曲
        // this.getPageData(id)
        this.serupPlayStoreListener()
        // 动态计算内容高度
        const globalDtaa = getApp().globalData
        const screenHeight = globalDtaa.screenHeight
        const statusBarHeight = globalDtaa.statusBarHeight
        const NavBarHeight = globalDtaa.NavBarHeight
        const deviceRadio = globalDtaa.deviveRadio
        const contentHeight = screenHeight - statusBarHeight - NavBarHeight
    
        this.setData({ contentHeight, isMusicLyric: deviceRadio >= 2 })
        // this.setupAudioContextListener()
    },

    // ================  事件处理   ================ 
    handleSwiperChange(event) {
       const currentPage = event.detail.current
       this.setData({ currentPage })
    },
    
    // 播放条拖拽事件
    handleSliderChangeing: function(event) {
        const value = event.detail.value
        const currentTime = this.data.durationTime * value / 100
        this.setData({iSliderchanging: true , currentTime})
        
    },

    // 改变进度条
    handleSliderChange: function(event) {
        // 获取slider变化的值
        const value = event.detail.value
        // 2.需要播放的currentTime
        const currentTime = this.data.durationTime * value / 100
       
        // 3.设置context播放currentTime位子的音乐
        // audioContext.pause()
        audioContext.seek(currentTime / 1000)

        // 记录最新的sliderValue
        this.setData({ sliderValue: value, iSliderchanging: false })

    },

    // 播放模式
    handleModeBtnClick: function() {
        let playModeIndex = this.data.playModeIndex + 1
        if ( playModeIndex === 3)  playModeIndex = 0
        playerStore.setState("playModeIndex", playModeIndex)
    },
    // 暂停和播放事件
    handleplayBtnClick: function() {
        playerStore.dispatch("changeMusicPlayStatusAction", !this.data.isPlaying)
        
    },
    // 监听上一首歌曲和下一首歌曲
    handlePerviousBtnClick: function() {
        playerStore.dispatch("changeNewMusicAction", false)
    },
    handleNextBtnClick: function() {
        playerStore.dispatch("changeNewMusicAction")
    },

    // 网咯请求
    serupPlayStoreListener: function() {
        // 1监听currentSong/durationTime/yricInfos
        playerStore.onStates(["currentSong", "durationTime", "lyricInfos"], ({
            currentSong,
            durationTime,
            lyricInfos
        }) => {
           if(currentSong) this.setData({ currentSong })
           if(durationTime) this.setData({ durationTime })
           if(lyricInfos) this.setData({ lyricInfos })
        })

        // 2.监听currentTime/currentLyricIndex/currentLyricText
        playerStore.onStates(["currentTime", "currentLyricIndex", "currentLyricText"], ({
            currentTime,
            currentLyricIndex,
            currentLyricText
        }) => {
            // 时间变化
            if (currentTime && !this.data.isSliderchanging) {
                const sliderValue = currentTime / this.data.durationTime * 100
                this.setData({ currentTime, sliderValue })
            }
            // 歌词变化
            if (currentLyricIndex) {
                this.setData({ currentLyricIndex, lyricScrollTop: currentLyricIndex * 35 })
            }
            if (currentLyricText) {
                this.setData({ currentLyricText })
            }

         
        })

        // 3.监听播放模式相关的数据
        playerStore.onStates(["playModeIndex", "isPlaying"], ({ playModeIndex, isPlaying }) => {
           if(playModeIndex !== undefined) {
            this.setData({ playModeIndex, playModeName: playModeNames[playModeIndex] })
           }
           
           if(isPlaying !== undefined) {
            this.setData({ 
                isPlaying,
                playingName: isPlaying ? "pause" : "resume"
             })
           }
        })
    },

      // 点击放回上一页
    handleBackBtnClick() {
        wx.navigateBack()
    },
    onUnload: function() {},
   
})